import React from 'react'
import '../login/style.scss'
import { useNavigate } from 'umi'
import { goLogin } from '@a/home'
import {
  Form,
  Input,
  Button,
  Toast
} from 'antd-mobile'
export default function index() {
  const navigate = useNavigate()
  const loginUser = (params: { username: string, pwd: string }) => {
    goLogin({
      ...params,
      deviceId: 12138,
      deviceName: '菠萝'
    }).then(res => {
      if (res.data.code === 0) {
        // 将token 缓存
        localStorage.setItem("token", res.data.data.token)
        Toast.show({
          icon: 'success',
          content: '登录成功',
          afterClose: () => {
            // 去首页
            navigate('/home', { replace: true })
          }
        })
      }
      if (res.data.code === 500) {
        Toast.show({
          icon: 'fail',
          content: res.data.msg,
        })
      }
    })
  }
  return (
    <div className='login'>
      <div className="login-mian">
        <Form
          layout='horizontal'
          onFinish={loginUser}
        >
          <Form.Item
            name='username'
            label='姓名'
            rules={[{ required: true, message: '姓名不能为空' }]}
          >
            <Input onChange={console.log} placeholder='请输入姓名'
              style={{
                lineHeight: 40,
                height: 40
              }}
            />
          </Form.Item>
          <Form.Item
            name='pwd'
            label='密码'
            rules={[{ required: true, message: '密码不能为空' }]}
          >
            <Input onChange={console.log} placeholder='请输入密码'
              style={{
                lineHeight: 40,
                height: 40
              }}
            />
          </Form.Item>
          <div className="login-but">
            <Button block color='primary' size='large' type='submit'>
              登录
            </Button>
            <Button block color='primary' size='large' type='reset'>
              重置
            </Button>
          </div>
          <Button block color='primary' size='large'
            onClick={
              () => {
                navigate('/reg')
              }
            }
          >
            立即注册
          </Button>
        </Form>
      </div>
    </div>
  )
}
